<!DOCTYPE html>
<html ng-app="ModalDemo">
<head>
<title></title>
<script src="/assets/angular/js/angular.js"></script>
<script src="/assets/angular-animate/js/angular-animate.js"></script>
<!-- <script src="assets/ui-bootstrap/js/ui-bootstrap-tpls-2.0.0.js"></script> -->
<link href="/assets/bootstrap/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
	<div>
<!-- 	<div ng-controller="ModalDemoCtrl"> -->
		<script type="text/ng-template" id="myModalContent.html">  
        <div class="modal-header">  
            <h3>I'm a modal!</h3>  
        </div>  
        <div class="modal-body">  
            <ul>  
                <li ng-repeat="item in items">  
                    <a ng-click="selected.item = item">{{ item }}</a>  
                </li>  
            </ul>  
            Selected: <b>{{ selected.item }}</b>  
        </div>  
        <div class="modal-footer">  
            <button class="btn btn-primary" ng-click="ok()">OK</button>  
            <button class="btn btn-warning" ng-click="cancel()">Cancel</button>  
        </div>  
    </script>
		<button class="btn" ng-click="open()">Open me!</button>
	</div>
	<script>
		var ModalDemo = angular.module('ModalDemo', [ 'ui.bootstrap' ]);
		var ModalDemoCtrl = function($scope, $modal, $log) {
			$scope.items = [ 'item1', 'item2', 'item3' ];
			$scope.open = function() {
				var modalInstance = $modal.open({
					templateUrl : 'myModalContent.html',
					controller : ModalInstanceCtrl,
					resolve : {
						items : function() {
							return $scope.items;
						}
					}
				});
				modalInstance.opened.then(function() { //模态窗口打开之后执行的函数  
					console.log('modal is opened');
				});
				modalInstance.result.then(function(result) {
					console.log(result);
				}, function(reason) {
					console.log(reason); //点击空白区域，总会输出backdrop click，点击取消，则会暑促cancel  
					$log.info('Modal dismissed at: ' + new Date());
				});
			};
		};
		var ModalInstanceCtrl = function($scope, $modalInstance, items) {
			$scope.items = items;
			$scope.selected = {
				item : $scope.items[0]
			};
			$scope.ok = function() {
				$modalInstance.close($scope.selected);
			};
			$scope.cancel = function() {
				$modalInstance.dismiss('cancel');
			};
		};
	</script>
</body>
</html>